<%@ page contentType="text/html;charset=UTF-8" language="java"  import="java.util.*" trimDirectiveWhitespaces="true" %>
<%@include file="/WEB-INF/pages/common/taglib.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>平台商品编辑</title>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <%@include file="/WEB-INF/pages/common/commonCss.jsp"%>
  <link rel="stylesheet" href="${basePath}/resources/css/select2.css" />
  <link rel="stylesheet" href="${basePath}/resources/css/matrix-style.css" />
  <link rel="stylesheet" href="${basePath}/resources/css/matrix-media.css" />
  <link rel="stylesheet" href="${basePath}/resources/css/bootstrap-wysihtml5.css" />



</head>
<style>
  .select2-container {
    float:left;
    width: 35%;
  }
</style>
<body>

<!--Header-part-->
<%@include file="/WEB-INF/pages/common/head.jsp"%>


<!--sidebar-menu-->
<%@include file="/WEB-INF/pages/common/left.jsp"%>

<div id="content">
  <div id="content-header">
    <div id="breadcrumb"> <a href="#" title="Go to Home" class="tip-bottom"><i class="icon-home"></i> </a>
      <a href="#" class="current">平台商品编辑</a> </div>
    <%--<h1>平台商品编辑</h1>--%>
  </div>

  <div class="container-fluid">

    <div class="row-fluid">
      <div class="span12">
        <div class="widget-box">
          <div class="widget-title"> <span class="icon"> <i class="icon-align-justify"></i> </span>
            <h5></h5>
          </div>
          <div class="widget-content nopadding" >
            <form action="${adminPath}/shop/good/updateGoodAndChild" method="POST"  class="form-horizontal" id="form" name="example">
              <input type="hidden"  name="id" value="${good.id}"/>
              <input type="file" class="hidden" id="file" name="file"  accept="image/jpeg,image/png,image/gif,audio/mp3"  onchange="uploadFile()" />

              <div class="control-group">
                <label class="control-label">商品标题 :</label>
                <div class="controls">
                  <input type="text" class="span11" id="title" name="title"  placeholder="商品标题" value="${good.title}">
                </div>
              </div>

              <div class="control-group">
                  <label class="control-label">主图(860*860) :</label>
                  <input type="hidden" name="bannerurl" id="bannerurl" value="${good.bannerurl}">
                  <div class="controls">
                    <img  data-img="" onclick="openBrowse(this,0)" data-dir="good/images" src="${good.bannerurl}" alt="" width="300" height="300">
                  </div>
              </div>

              <div class="control-group">
                <label class="control-label">商品简介 :</label>
                <div class="controls">
                  <input type="text" class="span8"  name="shortinfo" placeholder="商品简介"  value="${good.shortinfo}" id="shortinfo">
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">一级分类:</label>
                <div class="controls">
                  <select id="firstcatogory"   value="${good.categoryPid}"  onchange="good.getSecondCatagory()">
                    <c:forEach  items="${firstcatogorys}" var="catogory">
                      <option value="${catogory.id}"  ${good.categoryPid==catogory.id?'selected':''}>${catogory.name}</option>
                    </c:forEach>
                  </select>
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">二级分类:</label>
                <div class="controls">
                  <select  name="categoryId" id="categoryId" value="${good.categoryId}">
                    <option value="">--请选择--</option>
                    <c:forEach  items="${secondcatogorys}" var="catogory">
                      <option value="${catogory.id}"  ${good.categoryId==catogory.id?'selected':''}>${catogory.name}</option>
                    </c:forEach>
                  </select>
                </div>
              </div>


              <div class="control-group">
                <label class="control-label">纯度:</label>
                <div class="controls">
                  <select style="" name="purity" id="purity">
                    <option value="">--请选择--</option>
                    <option value="001"  ${good.purity=="001"?'selected':''}>千足金</option>
                    <option value="002"  ${good.purity=="002"?'selected':''}>24K</option>
                    <option value="003"  ${good.purity=="003"?'selected':''}>18K</option>
                    <option value="004"  ${good.purity=="004"?'selected':''}>14K</option>
                  </select>
                </div>
              </div>


              <div id="p_colorCode" style="background:#fff2db;">
                <c:forEach items="${goodChildren}" var="item" varStatus="status">
                      <p id="length" style="display: none">${goodChildren.size()-1}</p>
                     <input name="goodChildList[${status.index}].goodChildId" type="hidden" value="${item.goodChildId}" />

                      <div class="control-group">
                        <label class="control-label">
                          <i class="icon-plus" style="margin-right: 1rem" onclick="good.addColor()"></i>
                          颜色 :
                        </label>

                        <div class="controls">
                          <input type="text" class="span2 childColor"   name="goodChildList[${status.index}].color" value="${item.color}" placeholder="颜色">
                        </div>
                      </div>

                      <div class="control-group">
                        <label class="control-label"> 数量:</label>
                        <div class="controls">
                          <input type="number" name="goodChildList[${status.index}].stocknumber" onblur="good.addstocknum(this)" value="${item.stocknumber}"  placeholder="所选数量"  class="span2 stocknumber childStocknumber">
                        </div>
                      </div>


                      <div class="control-group" style="margin-bottom: 0.2rem">
                        <label class="control-label">该颜色图(720*480)</label>
                        <input type="hidden" name="goodChildList[${status.index}].imgurl" value="${item.imgurl}">
                        <div class="controls">
                          <img  data-img="" onclick="openBrowse(this,0)" data-dir="good/images" src="${item.imgurl}" alt="" width="300" height="300">
                        </div>
                      </div>

                </c:forEach>
              </div>

              <div class="control-group">
                <label class="control-label">销售价格:</label>
                <div class="controls">
                  <div class="input-append">
                    <input type="text" id="saleprice" name="saleprice" value="${good.saleprice}" placeholder="0.000" class="span11" >
                    <span class="add-on">元</span> </div>
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">折扣价格:</label>
                <div class="controls">
                  <div class="input-append">
                    <input type="text"  name="discprice"  value="${good.discprice}" placeholder="0.000" class="span11" id="discprice">
                    <span class="add-on">元</span> </div>
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">重量数:</label>
                <div class="controls">
                  <div class="input-append">
                    <input type="text" id="weight" name="weight"   value="${good.weight}" placeholder="0.000" class="span11" >
                    <span class="add-on">克</span> </div>
                </div>
              </div>


              <div class="control-group">
                  <label class="control-label">总库存数量 :</label>
                  <div class="controls">
                    <input type="text" class="span5" id="stocknum" name="stocknum" value="${good.stocknum}" readonly="readonly"  placeholder="库存数量">
                  </div>
              </div>


              <div class="control-group">
                <label class="control-label">是否推荐</label>
                <div class="controls">

                  <label>
                    <input type="radio" value="001" name="ishotCode" ${good.ishotCode == '001' ? 'checked':''}>  显示
                  </label>
                  <label>
                    <input type="radio" value="002" name="ishotCode" ${good.ishotCode == '002' ? 'checked':''}> 不显示
                  </label>
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">是否显示</label>
                <div class="controls">
                  <label>
                    <input type="radio" value="001" name="showCode" ${good.showCode == '001' ? 'checked':''}>  显示
                  </label>
                  <label>
                    <input type="radio" value="002" name="showCode" ${good.showCode == '002' ? 'checked':''}> 不显示
                  </label>
                </div>
              </div>

              <div class="control-group">
                <label class="control-label">是否可换</label>
                <div class="controls">
                  <label>
                    <input type="radio" value="0" name="canchange" ${good.canchange == 0 ? 'checked':''}> 可换
                  </label>
                  <label>
                    <input type="radio" value="1" name="canchange" ${good.canchange == 1 ? 'checked':''}> 不可换
                  </label>
                </div>
              </div>



              <div class="control-group">
                <label class="control-label">商品详情</label>
                <div class="controls">
                  <textarea id="editor_id"  class="span10"  name="description" style="width:95%;height:300px;" check-type="required" >
                    ${good.description}
                  </textarea>

                </div>
              </div>


              <div class="form-actions">
                <div class="control-group">
                  <div class="controls">
                    <button type="button" onclick="good.submit()"  class="btn btn-success" >保存</button>
                    <button type="reset" class="btn btn-default"  onclick="history.go(-1)">返回</button>
                  </div>
                </div>
              </div>

            </form>
          </div>

        </div>
      </div>
    </div>
  </div>
</div>


<!-- Modal -->

</div>



<!--Footer-part-->
<%@include file="/WEB-INF/pages/common/footer.jsp"%>

<!--end-Footer-part-->

<%@include file="/WEB-INF/pages/common/commonJS.jsp"%>
<script src="${basePath}/resources/js/bootstrap.min.js"></script>
<script src="${basePath}/resources/js/select2.min.js"></script>
<script src="${basePath}/resources/js/kindeditor-4.1.10/kindeditor.js"></script>
<script src="${basePath}/resources/js/kindeditor-4.1.10/lang/zh_CN.js"></script>
<script src="${basePath}/resources/js/kindeditor-4.1.10/plugins/code/prettify.js"></script>
<script type="text/javascript" src="${basePath}/resources/js/upload/upload.js"></script>




<script>
  //上传图片预览方法
  $('#img').change(function () {
    var file = this.files[0]; //选择上传的文件
    var r = new FileReader();
    r.readAsDataURL(file); //Base64
    $(r).load(function () {
      $('#imagepreview').html('<img src="' + this.result + '" width="100px" height="100px" alt="商品图片" />');
    });
  });

  KindEditor.ready(function(K) {
      K.create('#editor_id', {
          uploadJson : basePath+'/kindEditor/fileUpload',
          fileManagerJson : basePath+'/kindEditor/fileManager',
          allowFileManager : true ,
          afterCreate : function() {
              var self = this;
              K.ctrl(document, 13, function() {
                  self.sync();
                  document.forms['example'].submit();
              });
              K.ctrl(self.edit.doc, 13, function() {
                  self.sync();
                  document.forms['example'].submit();
              });
          } ,
          //下面这行代码就是关键的所在，当失去焦点时执行 this.sync();
          afterBlur: function(){this.sync();}
      });
      prettyPrint();
  })


  var good = {
        //显示图片
        showImg:function (obj) {
              var $this = $(obj);
              var file = obj.files[0]; //选择上传的文件
              var r = new FileReader();
              r.readAsDataURL(file); //Base64
              $this.parent();
    //        alert($this.prop("outerHTML"));
    //        alert($this.parent().parent().prop("outerHTML"));
    //        alert($this.parent().parent().prev().find(".imagepreview").prop("outerHTML"));
              $(r).load(function () {
                  //$('.imagepreview').html('<img src="' + this.result + '" width="100px" height="100px" alt="商品图片" />');
                  $this.parent().parent().prev().find(".imagepreview").html('<img src="' + this.result + '" width="100px" height="100px" alt="商品图片" />');
              });
        },
      //编辑颜色
      addColor:function(){
          var length =  parseInt($("#length").html()) + 1;
          $("#length").html(length);
          $("#p_colorCode").append("<div class='control-group'>"+
              "  <label class='control-label'>"+
              "	<i class='icon-plus' style='margin-right: 1rem' onclick='good.addColor()'></i>颜色 :"+
              "  </label>"+
              "  <div class='controls'>"+
              "	<input type='text' class='span2 childColor'   name='goodChildList["+length+"].color' placeholder='颜色'>"+
              "  </div>"+
              "</div> "+
              "<div class='control-group'>"+
              "  <label class='control-label'> 数量:</label>"+
              "  <div class='controls'>"+
              "	  <input type='number' name='goodChildList["+length+"].stocknumber' onblur='good.addstocknum(this)'   placeholder='所选数量'  class='span2 stocknumber childStocknumber'>"+
              "  </div>"+
              "</div>  "+
              "<div class='control-group' >"+
              "  <label class='control-label'>该颜色图(720*480)</label>"+
              "  <input type='hidden' name='goodChildList["+length+"].imgurl' width='300' height='300'>"+
              "  <div class='controls'>"+
              "<img  data-img='' onclick='openBrowse(this,0)' data-dir='good/images' src='xxx' alt=''>" +
              "</div>");
          imgerr.init();

      } ,
      addstocknum:function(obj){
            var totalnum =   0;
            $(".stocknumber").each(function(index){
              var num =0;
              if($(this).val()){
                num =   $(this).val()*1;
                totalnum=totalnum*1 + num;
              }
            });
            $("#stocknum").val(totalnum);
      },
      getSecondCatagory:function(){
            var firstcatogory = $("#firstcatogory").val();
             $("#categoryId").val("");//
            if(!firstcatogory){
              return;
            }
            $.ajax({
              type:'POST',
              url:basePath+'/admin/shop/good/getSecondCatogory',
              data:{pid:firstcatogory},
              success:function(data){
                var html = "";
                for(var i= 0,len=data.length;i<len;i++){
                  html+="<option value='"+data[i].id+"'>"+data[i].name+"</option>";
                }
                console.log(html);
                $("#categoryId").html(html);
              },
              error:function(err){
                console.log(err);
              }
            });
      },
      submit:function () {
          var edtior = $("#editor_id").val();
          var title = $('#title').val();
          var shortinfo =  $('#shortinfo').val();
          var purity =  $('#purity').val();
          var discprice =  $('#discprice').val();
          var saleprice =  $('#saleprice').val();
          var weight =  $('#weight').val();
          var stocknum =  $('#stocknum').val();

          var mark = false; //图片标示
          var childColorMark = false; //图片标示
          var childStocknumberMark = false; //图片标示

          //childColor
          //childStocknumber
          $("img").each(function(){
              var $this = $(this);
              console.log($this.attr('src'));
              if ($this.attr('src')=='' || ($this.attr('src').indexOf('resources/images/noimage.gif')!=-1)) {
                  mark = true;
              }
          });
          $(".childColor").each(function(){
              var val = $(this).val();
              if(isEmpty(val)){
                  childColorMark = true;
              }
          });
          $(".childStocknumber").each(function(){
              var val = $(this).val();
              if(isEmpty(val)){
                  childStocknumberMark = true;
              }
          });
          if(mark){
              loading("还有未上传的图片",4);
              return;
          }
          if(childColorMark){
              loading("请核对颜色是否填写完整",4);
              return;
          }
          if(childStocknumberMark){
              loading("请核对分类库存数量是否填写完整",4);
              return;
          }
          if(isEmpty(title)){
              loading("请输入商品标题",4);
              $("#title").focus();
              return;
          }
          if(isEmpty(shortinfo)){
              loading("请输入商品简介",4);
              $("#shortinfo").focus();
              return;
          }
          if(isEmpty(purity)){
              loading("请选择商品纯度",4);
              return;
          }
          if(isEmpty(discprice)){
              loading("请输入原价格",4);
              return;
          }
          if(isEmpty(saleprice)){
              loading("请输入销售价格",4);
              return;
          }
          if(isEmpty(weight)){
              loading("请输入重量数",4);
              return;
          }
          if(isEmpty(stocknum)){
              loading("请输入库存数量",4);
              return;
          }
          if(isEmpty(edtior)){
              loading("商品详情不能为空",4);
              return;
          }
          $("#form").submit();
      }
  };


  function tz_uploadsuccess(jdata ,obj) {
      if (jdata.target ==0) {
          console.log(JSON.stringify(jdata.name) );
          $(obj).attr("src", basePath + "/" + jdata.url + "?" + new Date().getTime()).css({width:300,height:200});
          $(obj).parent().prev().val(JSON.stringify(jdata.name));
//          $("#bannerurl").val(JSON.stringify(jdata.name));
      } else if (jdata.target == "#audio") {
          $(jdata.target).attr("src", basePath + "/" + jdata.url).data("link", jdata.url);
          $("#musictitle").val(jdata.name);
          $("#musicsize").val(jdata.size);
          $("#musiclink").val(jdata.url);
          adminBlog.audioDom.oncanplaythrough = function () {
              var time = this.duration;
              var m = Math.ceil(time / 60);
              var s = Math.ceil(time % 60);
              if (m < 10) m = "0" + m;
              if (s < 10) s = "0" + s;
              $("#musictime").val(m + ":" + s);
          }
      }
  }



</script>


</body>
</html>
